<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<lv-tabs [(lvActiveIndex)]="activeIndex" class="aui-tab" (lvActiveIndexChange)="change()">
  <lv-tab lvTitle="{{ 'common_summary_label' | i18n }}" lvId="summary">
    <ng-template lv-tab-lazy>
      <lv-form class="formGroup aui-gutter-column-xxl">
        <lv-form-item>
          <lv-form-label>
            {{ 'common_name_label' | i18n }}
          </lv-form-label>
          <lv-form-control>
            {{ data?.name | nil }}
          </lv-form-control>
        </lv-form-item>

        <lv-form-item>
          <lv-form-label>
            {{ 'common_desc_label' | i18n }}
          </lv-form-label>
          <lv-form-control>
            {{ data?.description | nil }}
          </lv-form-control>
        </lv-form-item>
        <lv-form-item>
          <lv-form-label>
            {{ 'common_period_label' | i18n }}
          </lv-form-label>
          <lv-form-control>
            <lv-form-item>
              <lv-form-label [lvColon]="true">
                {{ 'protection_frequency_label' | i18n }}
              </lv-form-label>
              <lv-form-control>
                {{ data?.freq | nil }}
              </lv-form-control>
            </lv-form-item>
            <lv-form-item>
              <lv-form-label [lvColon]="true">
                {{ 'common_replication_time_window_label' | i18n }}
              </lv-form-label>
              <lv-form-control>
                <ng-container *ngFor="let item of data.airGapPolicyWindows">
                  <div>{{ item.startTime }} - {{ item.endTime }}</div>
                </ng-container>
              </lv-form-control>
            </lv-form-item>
          </lv-form-control>
        </lv-form-item>
      </lv-form>
    </ng-template>
  </lv-tab>

  <lv-tab
    lvTitle="{{ 'common_associated_storage_devices_label' | i18n }}"
    lvId="device"
  >
    <ng-template lv-tab-lazy>
     
        <lv-pro-table
        #dataTable
        [config]="tableConfig"
        [data]="tableData"
      ></lv-pro-table>


    </ng-template>
  </lv-tab>
</lv-tabs>
